<!-- 商品列表，单品，一行两列 -->
<template>
  <div class="goods_list2">
    <div class="big_title">{{goods_list2_title}}</div>
    <ul class="list">
      <li v-for="(item,index) of goods_list2_data" :key="index">
        <div class="img">
          <img v-lazy="item.img_url" alt="">
        </div>
        <div class="title">{{item.product_name}}</div>
        <div class="price"><span class="now_price">&yen;{{item.sale_price}}</span><span class="old_price">&yen;{{item.price}}</span></div>
      </li>
    </ul>
    <div class="h10"></div>
  </div>
</template>

<script>
export default {
    name: 'GoodsList2',
    props:{
      goods_list2_data:Array,
      goods_list2_title:String
    }
}

</script>

<style lang="stylus" scoped>
.goods_list2{width:100%;overflow:hidden;background:#fff;margin-top:0.2rem;}
.big_title{width:100%;overflow:hidden;padding:0.2rem 0;font-size:0.32rem;text-align:center;color:#df4b53;border-bottom:1px solid #f7f7f7;}
.list{width:100%;overflow:hidden;background:#f7f7f7;}
.list li{width:49%;margin-left:2%;overflow:hidden;float:left;margin-top:0.2rem;background:#Fff;}
.list li:nth-child(odd){margin-left:0;}
.list li:nth-child(1),.list li:nth-child(2){margin-top:0;}
.img{width:100%;height:0;padding-bottom:100%;}
.img img{width:100%;}
.title{height:0.8rem;line-height:0.4rem;overflow: hidden;text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: 2;font-size:0.28rem;color:#363636;font-weight:normal;white-space:normal;padding:0 0.1rem;}
.price{font-size:0.32rem;color:#df4b53;margin-top:0.1rem;padding:0 0.1rem 0.1rem 0.1rem;}
.price span{display:inline-block;}
.price .now_price{}
.price .old_price{margin-left:0.2rem;color:#aaa;text-decoration:line-through;font-size:0.3rem;}
.h10{height:10px;background:#f7f7f7;}
</style>